<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Frank's Homepage@CSIE, NTU</title>

    <!-- Bootstrap -->
    <link href="bootstrap.min.css" rel="stylesheet">

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
      <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
  
    <style type="text/css">
    @media all and  (min-width: 1000px) {
        body {
            background-image: url(lighthouse.jpg);
            background-size: cover;
            background-repeat: no-repeat;
        }
    }

    .panel {
        width: 300px;
        margin-left: 20px;
    }
    body {
        max-width: 1200px;
        padding-top: 80px;
        background-color: skyblue;
    }
    a.list-group-item:hover {
        text-decoration: underline;
    }
    ul.nav {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        background-color: white;
        padding: 6px 10px;
        z-index: 1030;
        border-radius: 6px;
        margin: 6px 10px;
    }
/*
    ul.nav:after {
        background-image: linear-gradient(#ffffff,rgba(255,255,255,0));
        width: 100%;
        top: 18px;
        position: relative;
        height: 8px;
    }
*/
    .col-md-1 {
        padding: 0;
    }
    .panel-body {
        padding: 0;
    }
    
    </style>
  </head>
  <body>

<ul class="nav nav-pills">
  <li class="active"><a href="#common" data-toggle="tab">Common</a></li>
  <li><a href="#tools" data-toggle="tab">Tools</a></li>
  <li><a href="#ura" data-toggle="tab">うら</a></li>
</ul>


<!-- Tab panes -->
<div class="tab-content container-fluid">
  <div class="tab-pane active row" id="common">

    <div class="col-md-1 panel panel-primary">
        <div class="panel-heading">Blog and Website</div>
        <div class="list-group panel-body">
            <a href="http://franks543.blogspot.com/"  class="list-group-item" target="_blank">Frank的五四三 (blogger)</a>
            <a href="http://www.csie.ntu.edu.tw/~b91072/php/gb/"  class="list-group-item" target="_blank">五四三留言板</a>

            <a href="http://fujirou.blogspot.com/" class="list-group-item" target="_blank">Японская музыка</a>
            <a href="http://franklai.blogspot.com/" class="list-group-item" target="_blank">Frank的五四三 (CS分站)</a>

            <a href="http://u.csie.org/franks543" class="list-group-item" target="_blank">Frank的五四三 (static page)</a>
            <a href="http://franks543.googlecode.com/svn/trunk/index.htm" class="list-group-item" target="_blank">Frank的五四三 (googlecode mirror)</a>

            <a href="http://franks543.googlecode.com/hg/ext/index.htm" class="list-group-item" target="_blank">Ext JS test page</a>
        </div>
    </div>

    <div class="col-md-1 panel panel-info">
        <div class="panel-heading">Python</div>
        <div class="list-group panel-body">
            <a href="http://franklai-gb.appspot.com/lyric_get/"  class="list-group-item" target="_blank">Lyric Get@GAE</a>
            <a href="http://mymedia-get.appspot.com/mymedia_get/"  class="list-group-item" target="_blank">Mymedia Get@GAE</a>
            <a href="http://franklai-gb.appspot.com/mymedia_playlist/"  class="list-group-item" target="_blank">Mymedia Playlist@GAE</a>
            <a href="http://code.google.com/p/py-lyric-retriever/"  class="list-group-item" target="_blank">pyLyricRetriever</a>
        </div>
    </div>

    <div class="col-md-1 panel panel-default">
        <div class="panel-heading">Social Network</div>
        <div class="list-group panel-body">
            <a href="http://www.facebook.com/profile.php?id=1832836714"  class="list-group-item" target="_blank">facebook</a>
            <a href="http://twitter.com/franklai_tw"  class="list-group-item" target="_blank">twitter</a>
            <a href="http://www.plurk.com/fujirou"  class="list-group-item" target="_blank">Plurk</a>
            <a href="https://plus.google.com/108294145085400855217/"  class="list-group-item" target="_blank">Google+</a>
            <a href="http://www.anobii.com/franklai/"  class="list-group-item" target="_blank">aNobii</a>
        </div>
    </div>

    <div class="col-md-1 panel panel-default">
        <div class="panel-heading">Photo Album and Media</div>
        <div class="list-group panel-body">
            <a href="https://picasaweb.google.com/108294145085400855217" class="list-group-item" target="_blank">Picasa</a>
            <a href="http://franklai.pixnet.net/album" class="list-group-item" target="_blank">Pixnet</a>
            <a href="http://www.wretch.cc/album/franklai" class="list-group-item" target="_blank">wretch</a>
            <a href="http://www.flickr.com/photos/79053230@N00/" class="list-group-item" target="_blank">flickr</a>
            <a href="http://mymedia.yam.com/fujirou" class="list-group-item" target="_blank">mymedia - fujirou</a>
            <a href="http://mymedia.yam.com/collec0yk1" class="list-group-item" target="_blank">mymeida - collec0yk1</a>
        </div>
    </div>
    
    <div class="col-md-1 panel panel-default">
        <div class="panel-heading">freedb</div>
        <div class="list-group panel-body">
            <a href="http://freedbtest.dyndns.org:80/~cddb/cddb.cgi" class="list-group-item" target="_blank">http://freedbtest.dyndns.org</a>
            <a href="http://freedb.freedb.org:80/~cddb/cddb.cgi" class="list-group-item" target="_blank">http://freedb.freedb.org</a>
        </div>
    </div>
  </div><!-- common end -->
  
  
  <div class="tab-pane row" id="tools">
    <div class="col-md-1 panel panel-success">
        <div class="panel-heading">Tools</div>
        <div class="list-group panel-body">
            <a href="http://franks543.googlecode.com/svn/trunk/js/dic.htm"  class="list-group-item" target="_blank">Dictionaries</a>
            <a href="http://w.csie.org/~b91072/U2B_oneLine.htm"  class="list-group-item" target="_blank">Converter</a>
            <a href="http://franks543.googlecode.com/svn/trunk/js/ptt_tax.htm"  class="list-group-item" target="_blank">P幣扣稅計算程式</a>
            <a href="http://franks543.googlecode.com/svn/trunk/js/lyric_search.htm"  class="list-group-item" target="_blank">Lyric Search</a>
            <a href="http://franks543.googlecode.com/svn/trunk/js/h2v.htm"  class="list-group-item" target="_blank">橫書轉直書</a>
        </div>
    </div>
  </div><!-- tools end -->
  
  <div class="tab-pane row" id="ura">

    <div class="col-md-1 panel panel-warning">
        <div class="panel-heading">JDrama</div>
        <div class="list-group panel-body">
            <a href="http://www.mytvbt.net/forumdisplay.php?fid=6"  class="list-group-item" target="_blank">TVBT</a>
            <a href="http://www.suppig.net/forum.php?mod=forumdisplay&fid=306"  class="list-group-item" target="_blank">SubPig</a>
            <a href="http://www.yyets.com/resourcelist?channel=tv&area=%E6%97%A5%E6%9C%AC" class="list-group-item" target="_blank">YYeTs</a>
            <a href="http://www.tvboxnow.com/forum-10-1.html"  class="list-group-item" target="_blank">日劇@TV Box Now</a>
        </div>
    </div>

    <div class="col-md-1 panel panel-primary">
        <div class="panel-heading">BitTorrent</div>
        <div class="list-group panel-body">
             <a href="http://share.dmhy.org/"  class="list-group-item" target="_blank">share.dmhy.org</a>
             <a href="http://bt.ktxp.com/"  class="list-group-item" target="_blank">KTXP BT</a>
             <a href="http://www.d-addicts.com/forum/torrents.php?tab=TVShow"  class="list-group-item" target="_blank">D-Addicts::Asian Drama Torrents</a>
             <a href="http://tracker.minglong.org:8080/"  class="list-group-item" target="_blank">minglong Tracker</a>
             <a href="https://nipponsei.minglong.org/tracker/"  class="list-group-item" target="_blank">Nipponsei Tracker</a>
             <a href="http://bt.davka.info/"  class="list-group-item" target="_blank">Davka BT</a>
        </div>
    </div>

    <div class="col-md-1 panel panel-info">
        <div class="panel-heading">Private Tracker</div>
        <div class="list-group panel-body">
            <a href="http://jpopsuki.eu/"  class="list-group-item" target="_blank">jpopsuki 2.0</a>
            <a href="http://open.cd/"  class="list-group-item" target="_blank">OpenCD</a>
            <a href="https://hdts.ru/"  class="list-group-item" target="_blank">HD-Torrents</a>
            <a href="http://u2.dmhy.org/"  class="list-group-item" target="_blank">U2分享園</a>
        </div>
    </div>

    <div class="col-md-1 panel panel-success">
        <div class="panel-heading">ebook</div>
        <div class="list-group panel-body">
             <a href="http://it-ebooks.info/" class="list-group-item" target="_blank">IT eBooks</a>
             <a href="http://www.wowebook.com/" class="list-group-item" target="_blank">Wow eBook</a>
             <a href="http://ebook.jiani.info/" class="list-group-item" target="_blank">搬书匠</a>
        </div>
    </div>
<!--
    <div class="col-md-1 panel">
        <div class="panel-heading">JDrama</div>
        <div class="list-group panel-body">
             <a href="" class="list-group-item" target="_blank"></a>
        </div>
    </div>
-->
  </div><!-- ura end -->
</div>



    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="bootstrap.min.js"></script>
  </body>
</html>
<!-- vim: set expandtab: -->
